import 'package:flutter/material.dart';
// 1、基础知识点:布局容器Padding、Container Widget使用、 Row Widget使用、Column Widget使用、
void main() => runApp(MaterialApp(
  home: Home(),
));


// 封装自定义无状态Widget Home(保存后会自动热重载)
class Home extends StatelessWidget {
  // 重写无状态Widget build
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text(
          // 标题
          "我是标题",
          // 文字颜色
          style: TextStyle(
            color: Colors.white,
          ),
        ),
        centerTitle: true,
        // 颜色
        backgroundColor: Colors.blue[200],
      ),
      // body: Padding(
        // padding: const EdgeInsets.all(40.0),
        //1、 Container Widget使用
      //   child: Container(
      //     color: Colors.blue[200],
      //     padding: EdgeInsets.all(20.0),
      //     margin: EdgeInsets.fromLTRB(10, 50, 0, 0),
      //     child: Text(
      //       "Container",
      //       style: TextStyle(
      //           color: Colors.red,
      //           fontSize: 30.0,
      //       ),
      //     ),
      //   ),
      // ),

      // 2、 Row Widget使用
      // body: Row(
      //   mainAxisAlignment: MainAxisAlignment.spaceEvenly,
      //   crossAxisAlignment: CrossAxisAlignment.center,
      //   children: [
      //     Text("Row1"),
      //     ElevatedButton(
      //         onPressed: () {},
      //         child: Text('ElevatedButton')
      //     ),
      //     TextButton(
      //         onPressed: () {},
      //         child: Text("TextButton")
      //     ),
      //     Container(
      //       child: Text("Container"),
      //     )
      //   ],
      // ),

      // 3、 Column Widget使用
      body: Column(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          Row(
            children: [
              Text("Column =》 Row =》 Text"),
            ],
          ),
          Text("Column1"),
          ElevatedButton(
              onPressed: () {},
              child: Text('ElevatedButton')
          ),
          TextButton(
              onPressed: () {},
              child: Text("TextButton")
          ),
          Container(
            child: Text("Container"),
          )
        ],
      ),
    );
  }
}